<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <div id="app">
        <button @click="fn">click</button>

        <!--在vue中一个组件就是一个vue实例对象-->
        <!--v-damu.$on("click",fn)-->
        <v-damu @click="fn"></v-damu>
    </div>
</body>
<script src="./js/vue.js"></script>
<script>

    // 在vue组件上使用@ 代表的是给当前组件注册vue自定义事件


    Vue.config.productionTip = false;

    Vue.component("v-damu",{
        template:`<div @click="fn">v-damu</div>`,
        methods:{
            fn(){
                //this:v-damu这个组件对象(vue实例)
                this.$emit("click")
            }
        }
    })

    new Vue({
        el:"#app",
        methods:{
            fn(){
                console.log("fn from root")
            }
        }
    })
</script>
</html>